<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>写文章 - 听到微笑的博客</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/style.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/font-awesome.min.css">
<link rel="apple-touch-icon-precomposed" href="${pageContext.request.contextPath }/images/icon/icon.png">
<link rel="shortcut icon" href="${pageContext.request.contextPath }/images/icon/favicon.ico">
<link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath }/css/quanpingpanel.css" />
<link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath }/css/quanpingbtn.css" />
<link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath }/css/yuanma.css" />
<style type="text/css">
.w-e-toolbar {
	flex-wrap: wrap;
}
</style>
<script src="js/jquery-2.1.4.min.js"></script>
</head>
<body class="user-select">
	<section class="container-fluid">
		<jsp:include page="common/top.jsp"></jsp:include>

		<div class="row">
			<jsp:include page="common/left.jsp"></jsp:include>
			<div class="col-sm-9 col-sm-offset-3 col-md-10 col-lg-10 col-md-offset-2 main" id="main">
				<div class="row">
					<form action="${pageContext.request.contextPath }/article/add.action" method="post" class="add-article-form">
						<input id="txtContent" name="txtContent" type="hidden" />
						<div class="col-md-9">
							<h1 class="page-header">撰写新文章</h1>
							<div class="form-group">
								<label for="article-title" class="sr-only">标题</label>
								<input type="text" id="article-title" name="title" class="form-control" placeholder="在此处输入标题" required autofocus autocomplete="off">
							</div>

							<div class="form-group">
								<label for="article-content" class="sr-only">内容</label>
								<div id="container">
									<!--菜单栏-->
									<div id="toolbar-container" style="background-color: #F1F1F1;">
										<div id="editor-toolbar">
											<!--全屏按钮-->
											<span id="fullScreenBtn" class="iconfont icon-quanping" style="height: 20px;margin-top: 5px;margin-right: 5px;margin-left:5px;cursor: pointer;"></span>
											<!--源码按钮-->
											<span id="yuanma" class="iconfont icon-html-" style="height: 20px;margin-top: 5px;margin-right: 5px;margin-left:10px;cursor: pointer;" onclick="yuanma()"></span>
										</div>
									</div>
									<div id="editor-text"></div>
									<textarea id="text1" name="content" style="display: none"></textarea>
								</div>
								<!--全屏模式-->
								<div id="cover"></div>
							</div>

							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>标签</span>
								</h2>
								<div class="add-article-box-content">
									<input type="text" class="form-control" placeholder="请输入关键字" name="keywords" autocomplete="off">
									<span class="prompt-text">多个标签请用英文逗号,隔开。</span>
								</div>
							</div>
							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>摘要</span>
								</h2>
								<div class="add-article-box-content">
									<textarea class="form-control" name="summary" autocomplete="off" ></textarea>
									<span class="prompt-text">描述是可选的手工创建的内容总结，并可以在网页描述中使用</span>
								</div>
							</div>
						</div>
						<div class="col-md-3">
							<h1 class="page-header">操作</h1>
							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>栏目</span>
								</h2>
								<div class="add-article-box-content">
									<ul class="category-list">
										<c:forEach items="${categoryList }" var="category" varStatus="status">
											<li>
												<label>
													<input name="categoryId" type="radio" value="${category.id }" checked>
													${category.name }
													<em class="hidden-md">
														( 栏目ID:
														<span>${status.count }</span>
														)
													</em>
												</label>
											</li>
										</c:forEach>
									</ul>
								</div>
							</div>

							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>文章来源</span>
								</h2>
								<div class="add-article-box-content">
									<input type="text" class="form-control" placeholder="请输入文章来源" name="source" autocomplete="off">
									<span class="prompt-text">例如：原创、CSDN、51CTO、博客园、StackOverflow等。</span>
								</div>
							</div>
							<div class="add-article-box">
								<h2 class="add-article-box-title">
									<span>发布</span>
								</h2>
								<div class="add-article-box-content">
									<p>
										<label>公开度：</label>
										<input type="radio" name="tab" value="1" checked />
										公开
										<input type="radio" name="tab" value="0" />
										私有
									</p>
								</div>
								<div class="add-article-box-footer">
									<button id="btn1" class="btn btn-primary" type="submit">发布</button>
								</div>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
	</section>

	<script type="text/javascript" src="${pageContext.request.contextPath }/js/wangEditor.min.js"></script>
	<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
	<script src="${pageContext.request.contextPath }/js/admin-scripts.js"></script>
	<!-- 为了简洁，将富文本编辑器的构建js独立到edit.js中 -->
	<script src="${pageContext.request.contextPath }/js/edit.js"></script>
	<script type="text/javascript">
		$(function() {
			$("#article").addClass('active');
			//刷新Session，防止Session失效
			var int = self.setInterval("refresh()", 60000);//60秒刷新一次
		})
		function refresh() {
			$.post(
				"${pageContext.request.contextPath }/session/update.action"
			);
		}
	</script>
</body>
</html>
